// @flow
import React from 'react';
import Box from '@material-ui/core/Box';

const Logo = () => {
  const color = '#ffffff';
  const inverseColor = '#000000';

  return (
    <Box width={35}>
      <svg
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
        version="1.1"
        x="0px"
        y="0px"
        viewBox="0 0 100 100"
        enableBackground="new 0 0 100 100"
        xmlSpace="preserve"
      >
        <path fill={color} d="M75.945,86.021l-17.15-27.06V32.478h2.96c1.472,0,2.667-1.193,2.667-2.667s-1.195-2.667-2.667-2.667H36.747  c-1.473,0-2.667,1.193-2.667,2.667s1.193,2.667,2.667,2.667h2.95l-0.096,26.601L22.683,85.838c-1.315,1.74-1.53,4.036-0.558,5.99  c0.972,1.955,2.932,3.168,5.115,3.168h44.023c2.182,0,4.142-1.215,5.115-3.168C77.348,89.873,77.137,87.579,75.945,86.021z   M71.601,89.451c-0.104,0.212-0.274,0.212-0.339,0.212H27.24c-0.063,0-0.234,0-0.339-0.21c-0.104-0.21-0.002-0.345,0.164-0.58  l16.921-26.761c0.681-0.902,1.055-2.022,1.055-3.152V32.478h8.42V58.96c0,1.13,0.374,2.25,0.931,2.971l17.173,27.124  C71.601,89.107,71.705,89.242,71.601,89.451z" />
        <circle fill={color} cx="47.063" cy="21.753" r="3.6" />
        <circle fill={color} cx="52.585" cy="9.805" r="5.2" />
        <path fill={color} d="M54.467,78.173c-5.855,0.376-12.822-7.62-14.802-5.135c-0.55,0.69-7.556,11.918-7.556,11.918  c-1.299,1.955-0.744,2.539,1.399,2.539h32.805c0.74,0,1.189-0.816,0.793-1.442l-5.622-8.878c-0.235-0.371-0.694-0.523-1.107-0.374  C58.467,77.49,56.521,78.04,54.467,78.173z" />
        <circle fill={inverseColor} cx="42" cy="80" r="3" />
      </svg>
    </Box>
  );
};

export default Logo;
